<template>
  <el-dialog
    :visible.sync="editFormVisible"
    width="600px"
    @close="dialogClose"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
  >
    <h3 slot="title" class="tx-c">护理人员数据导入</h3>
    <div class="mb20">
      <el-upload
        action="/"
        :auto-upload="false"
        :file-list="fileList"
        :limit="1"
        :on-change="onChangeFile"
        :on-remove="onRemoveFile"
        accept=".xlsx,.xls"
      >
        <el-button size="medium" type="primary">选择文件</el-button>
      </el-upload>
    </div>
    <div class="f16">
      <p>
        参考模板：<a href="/护理人员.xlsx" style="color: #409eff"
          >护理人员数据模板</a
        >
      </p>
    </div>
    <div slot="footer" class="flex-justify-bcenter">
      <el-button @click="editFormVisible = false">取 消</el-button>
      <el-button type="primary" @click="submitUpload" :loading="btnLoading"
        >确 定</el-button
      >
    </div>
  </el-dialog>
</template>

<script>
import { ApiDataImport } from "@/api/index";
export default {
  components: {},
  props: {},
  data() {
    return {
      editFormVisible: false,
      btnLoading: false,
      fileList: [],
    };
  },
  watch: {},
  computed: {},
  methods: {
    show() {
      this.editFormVisible = true;
    },
    dialogClose() {
      this.fileList = [];
      this.editFormVisible = false;
    },
    submitUpload() {
      if (this.fileList.length === 0) {
        this.$message.error("请先选择上传文件");
        return;
      }
      this.btnLoading = true;
      const formData = new FormData();
      formData.append("file", this.fileList[0].raw);
      ApiDataImport(formData, {
        headers: { "Content-Type": "multipart/form-data" },
        timeout: 60 * 60 * 1000,
      })
        .then((res) => {
          this.btnLoading = false;
          this.$message.success("数据导入成功");
          this.dialogClose();
          this.$emit("refresh");
        })
        .catch(() => {
          this.btnLoading = false;
        });
    },
    onChangeFile(file, fileList) {
      this.fileList.push(file);
    },
    onRemoveFile(file, fileList) {
      this.fileList = fileList;
    },
  },
  created() {},
  mounted() {},
};
</script>
<style lang="less" scoped></style>
